<template>
  <div class="bmap-page-container">
    <el-bmap vid="bmapDemo" :zoom="zoom" :center="center" class="bmap-demo">
      <el-bmapv-view>
        <el-bmapv-fly-line-layer :color="color" :texture-color="'#E93027'" :texture-width="20" :data="data"></el-bmapv-fly-line-layer>
      </el-bmapv-view>
    </el-bmap>
  </div>
</template>
<script>

module.exports = {
  name: 'bmap-page',
  data () {
    return {
      count: 1,
      zoom: 14,
      effect: 'chaos',
      step: 0.4,
      textureLength: 10,
      center: [116.406281, 39.916263],
      color: '#E93027',
      data: [{
        geometry: {
          type: 'LineString',
          coordinates: [
            [116.327518, 39.901209],
            [116.541386, 39.99679]
          ]
        },
        properties: {}
      }, {
        geometry: {
          type: 'LineString',
          coordinates: [
            [116.309695, 40.014476],
            [116.673617, 39.921576]
          ]
        },
        properties: {}
      }]
    }
  },
  mounted () {
  },
  methods: {}
}
</script>

<style>
.bmap-demo {
  height: 100vh;
}
</style>
